<template>
  <el-container>
    <el-header>
      <div class="left-panel">
        <el-button v-if="$AUTH('system:sysBranchOfficeInit:add')" type="primary" icon="el-icon-plus" @click="add"></el-button>
      </div>
      <div class="right-panel">
        <div class="right-panel-search">
			<el-select v-model="search.sysCompanyId" :placeholder="searchPlaceholder" filterable style="width: 30em;" @click="getSysCompanyData">
			  <el-option v-for="im in sysCompanyOptions" :key="im.sysCompanyId" :label="im.companyName" :value="im.sysCompanyId"></el-option>
			</el-select>
          <el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
        </div>
      </div>
    </el-header>
    <el-main class="nopadding">
      <scTable ref="table" :apiObj="apiObj" row-key="sysBranchOfficeId" :summaryMethod="indatad" v-on:dataChange="tableDataChange" @selection-change="selectionChange" stripe>
        <el-table-column type="selection" width="50"></el-table-column>
        <el-table-column label="ID" prop="sysBranchOfficeId" width="60"></el-table-column>
        <el-table-column label="分公司" prop="officeName" width="150"></el-table-column>
		<el-table-column label="系统" width="450">
			<template #default="scope">
				<el-space v-for="item in scope.row.systemLevelBranchList" :key="item.systemLevelBranchId">
					<el-button type="text" size="small" @click="systemLevelBranch_edit(item,scope.row.officeName,scope.row.sysBranchOfficeId)">{{item.typeName}}</el-button>
					<el-divider direction="vertical"></el-divider>
				</el-space>
				<el-button type="text" size="small" @click="systemLevelBranch_edit(null,scope.row.officeName,scope.row.sysBranchOfficeId)">添加</el-button>
			</template>
		</el-table-column>
        <el-table-column label="编码" prop="officeNo" width="80"></el-table-column>
        <el-table-column label="所属区域" prop="regionPath" width="90"></el-table-column>
        <el-table-column label="详细地址" prop="address" width="150"></el-table-column>
        <el-table-column label="负责人" prop="bossName" width="100"></el-table-column>
        <el-table-column label="电话" prop="telephone" width="150"></el-table-column>
        <el-table-column label="排序" prop="sort" width="60"></el-table-column>
        <el-table-column label="创建时间" prop="createTime" width="150"></el-table-column>
        <el-table-column label="状态" width="80">
			<template #default="scope">
				<span v-if="scope.row.status==1">激活</span><span v-else>失效</span>
			</template>
		</el-table-column>
        <el-table-column label="备注" prop="msg" width="150"></el-table-column>
        <el-table-column label="操作" fixed="right" align="right">
          <template #default="scope">
            <el-button v-if="$AUTH('system:sysBranchOfficeInit:edit')" type="text" size="small" @click="table_edit(scope.row, scope.$index)">编辑</el-button>
            <el-divider direction="vertical"></el-divider>
            <el-button v-if="$AUTH('system:sysBranchOfficeInit:del')" type="text" size="small" @click="table_del(scope.row, scope.$index)">删除</el-button>
          </template>
        </el-table-column>
      </scTable>
    </el-main>
  </el-container>
  <systemLevelBranchEdit-dialog v-if="dialog.systemLevelBranchEdit" ref="systemLevelBranchEditDialog" @success="handleSaveSuccess" @closed="dialog.systemLevelBranchEdit=false"></systemLevelBranchEdit-dialog>
  <sysBranchOfficeEdit-dialog v-if="dialog.sysBranchOfficeEdit" ref="sysBranchOfficeEditDialog" @success="handleSaveSuccess" @closed="dialog.sysBranchOfficeEdit=false"></sysBranchOfficeEdit-dialog>
</template>
<script>
  import systemAPI from '@/api/system/sysBranchOffice';
  import sysCompanyAPI from '@/api/system/sysCompany';
  import sysBranchOfficeEditDialog from './sysBranchOfficeEdit';
  import systemLevelBranchEditDialog from './systemLevelBranchEditInit';
  export default {
    name: 'sysBranchOffice',
    components: {
        sysBranchOfficeEditDialog,systemLevelBranchEditDialog
    },
    data() {
      return {
        dialog: {
          sysBranchOfficeEdit: false,systemLevelBranchEdit: false
        },
        apiObj: systemAPI.sysBranchOffice.list,
        selection: [],
        search: {
          keyword: null,
          createTime: null,
		  sysCompanyId: null,
		  officeNo: null,
		  bossName: null,
		  telephone: null,
		  officeName: null,
        },
		searchPlaceholder: "请选择企业",
		sysCompanyOptions: [],
      }
    },
    methods: {
      //添加
      add(){
        this.dialog.sysBranchOfficeEdit = true;
        this.$nextTick(() => {
          this.$refs.sysBranchOfficeEditDialog.open();
        })
      },
      //编辑
      table_edit(row){
        this.dialog.sysBranchOfficeEdit = true;
        this.$nextTick(() => {
          this.$refs.sysBranchOfficeEditDialog.open('edit').setData(row);
        })
      },
      //删除
      async table_del(row){
        var confirm = await this.$confirm('确定删除选中的项吗？', '提示', {
          confirmButtonText: 'ok',
          type: 'warning'
        }).catch(() => {})
        if(confirm !== 'confirm'){
          return false;
        }
        var res = await systemAPI.sysBranchOffice.delete.delete(row.sysBranchOfficeId);
        if(res.code === 2000){
          this.$refs.table.refresh();
          this.$message.success("删除成功");
        }else{
          this.$alert(res.message, "提示", {type: 'error'});
        }
      },
      //表格选择后回调事件
      selectionChange(selection){
        this.selection = selection;
      },
      //搜索
      upsearch(){
        this.$refs.table.upData(this.search);
      },
      //本地更新数据
      handleSaveSuccess(){
        this.$refs.table.refresh();
      },
      handlePermissionSuccess(){
        this.$refs.table.refresh();
      },
      handleDataSuccess(){
        this.$refs.table.refresh();
      },
      formatDate(row,column) {// 获取单元格数据
        let data = row[column.property];
        if(data == null) {
          return null;
        }
        let dt = new Date(data);
        return dt.getFullYear() + '-' + (dt.getMonth() + 1) + '-' + dt.getDate() + ' ' + dt.getHours() + ':' + dt.getMinutes() + ':' + dt.getSeconds();
      },
	  async getSysCompanyData(){
		  if(this.sysCompanyOptions.length < 2){
			  let reqData = {"current": 1,"size": 1000};
			  var res = await sysCompanyAPI.sysCompany.init.get(reqData);
			  if(res.code === 2000){
			    this.sysCompanyOptions=res.data.records;
			  }else{
			    this.$alert(res.message, "提示", {type: 'error'});
			  }
		  }
	  },
	  systemLevelBranch_edit(row,officeName,sysBranchOfficeId){//编辑系统
	    this.dialog.systemLevelBranchEdit = true
		if(row){
			this.$nextTick(() => {
			  this.$refs.systemLevelBranchEditDialog.open(officeName).setData(row);
			});
		}else{
			this.$nextTick(() => {
			  this.$refs.systemLevelBranchEditDialog.open(officeName,sysBranchOfficeId);
			});
		}
	  },
	  tableDataChange(res, tableData){//子页面列表数据事件触发回调函数， 设置下拉选择选择数据初始值
		  if(tableData && tableData[0]){
			  this.sysCompanyOptions = [{'sysCompanyId':tableData[0].sysCompanyId,'companyName':tableData[0].sysCompanyIdName}];
			  this.searchPlaceholder = tableData[0].sysCompanyIdName;
			  this.search.sysCompanyId = tableData[0].sysCompanyId;
		  }
	  },
    }
  }
</script>
<style>
</style>
